<template>
    <h2>添加房型页面</h2>
    <table border="1">
        <tr>
            <td>房型名称</td>
            <td>
                <input type="text" v-model="type.RT_Name"/>
            </td>
        </tr>
        <tr>
            <td>门市价</td>
            <td>
                <input type="text" v-model="type.RT_Price"/>
            </td>
        </tr>
        <tr>
            <td>押金</td>
            <td>
                <input type="text" v-model="type.RT_Deposit"/>
            </td>
        </tr>
        <tr>
            <td>面积</td>
            <td>
                <input type="text" v-model="type.RT_Size"/>
            </td>
        </tr>
        <tr>
            <td>可住人数</td>
            <td>
                <input type="text" v-model="type.RT_Num"/>
            </td>
        </tr>
        <tr>
            <td>房型图片</td>
            <td>
                <img style="width:100px;height:100px" :src="type.RT_Img"/>
                <input type="file" @change="FileUpLoad"/>
            </td>
        </tr>
        <tr>
            <td>是否加床</td>
            <td>
                <input type="radio" :value="true" v-model="type.RT_AddBed"/>加床
                <input type="radio" :value="false" v-model="type.RT_AddBed"/>不加床
            </td>
        </tr>
        <tr>
            <td>是否投放</td>
            <td>
                <input type="radio" :value="true" v-model="type.RT_State"/>投放
                <input type="radio" :value="false" v-model="type.RT_State"/>不投放
            </td>
        </tr>
        <tr>
            <td>房型介绍</td>
            <td>
                <input type="text" v-model="type.RT_Info"/>
            </td>
        </tr>
        <tr>
            <td></td>
            <td>
                <input type="button" value="添加" @click="addRoomType"/>
            </td>
        </tr>

    </table>
</template>

<script setup lang="ts">
    import {ref} from 'vue'
    import axios from 'axios'
    import {useRouter} from 'vue-router'
 const router=useRouter();
    const file=ref(null);
    const FileUpLoad=(e)=>{
        file.value=e.target.files[0];
        if(!file.value)
        {
            alert('请上传文件');
            return;
        }
        const formData=new FormData();
        formData.append('image',file.value);
        axios.post('https://localhost:44320/api/Files/FileUpLoad',formData)
        .then(res=>{
            console.log(res.data);
            if(res.data.StateCode==2)
            {
                alert(res.data.StateMessage);
            }
            else  if(res.data.StateCode==3)
            {
                alert(res.data.StateMessage);
            }
            else
            {
                alert(res.data.StateMessage);
                type.value.RT_Img=res.data.StateData;
            }
        })
    }
    const type=ref({
      "RT_Id": 1,
      "RT_Name": "",
      "RT_Price": null,
      "RT_Deposit": null,
      "RT_Size": null,
      "RT_Num":null,
      "RT_AddBed": false,
      "RT_Img": "",
      "RT_Info": "",
      "RT_State": true
    })
    const addRoomType=()=>{
        if(type.value.RT_Name=="")
        {
            alert('不能为空');
            return;
        }
        axios.post('https://localhost:44320/api/Room/TypeAdd',{
            "RT_Name": type.value.RT_Name,
      "RT_Price":  type.value.RT_Price,
      "RT_Deposit": type.value.RT_Deposit,
      "RT_Size": type.value.RT_Size,
      "RT_Num": type.value.RT_Num,
      "RT_AddBed":  type.value.RT_AddBed,
      "RT_Img":  type.value.RT_Img,
      "RT_Info":  type.value.RT_Info,
      "RT_State":  type.value.RT_State
        })
        .then(res=>{
            if(res.data==-1)
            {
                alert('名称不能重复');
            }
            else if(res.data>0)
            {
                alert('添加成功');
                router.push('/showRType');
            }
            else
            {
                alert('添加失败');
            }
        })
    }

</script>